﻿<!-- Gradient Control
    Author : Ashraful Mahmud
    Web : http://www.yagnaitsolution.ca
    -->
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:PresentationOptions="http://schemas.microsoft.com/winfx/2006/xaml/presentation/options"
                    xmlns:local="clr-namespace:YagnaColor">
    <DrawingBrush x:Key="CheckerBrush" Viewport="0,0,10,10" ViewportUnits="Absolute" TileMode="Tile">
        <DrawingBrush.Drawing>
            <DrawingGroup>
                <GeometryDrawing Brush="White">
                    <GeometryDrawing.Geometry>
                        <RectangleGeometry Rect="0,0 100,100" />
                    </GeometryDrawing.Geometry>
                </GeometryDrawing>
                <GeometryDrawing Brush="LightGray">
                    <GeometryDrawing.Geometry>
                        <GeometryGroup>
                            <RectangleGeometry Rect="0,0 50,50" />
                            <RectangleGeometry Rect="50,50 50,50" />
                        </GeometryGroup>
                    </GeometryDrawing.Geometry>
                </GeometryDrawing>
            </DrawingGroup>
        </DrawingBrush.Drawing>
    </DrawingBrush>

    <LinearGradientBrush x:Key="GlassBrush" StartPoint="0,0" EndPoint="1,1" Opacity="0.75">
        <LinearGradientBrush.GradientStops>
            <GradientStop Color="WhiteSmoke" Offset="0.2" />
            <GradientStop Color="Transparent" Offset="0.4" />
            <GradientStop Color="WhiteSmoke" Offset="0.5" />
            <GradientStop Color="Transparent" Offset="0.75" />
            <GradientStop Color="WhiteSmoke" Offset="0.9" />
            <GradientStop Color="Transparent" Offset="1" />
        </LinearGradientBrush.GradientStops>
    </LinearGradientBrush>

    <LinearGradientBrush x:Key="ColorDetailsBorderBrush" EndPoint="0.5,0" StartPoint="0.5,1">
        <GradientStop Color="#FF939598" Offset="0"/>
        <GradientStop Color="#FF1E1E24" Offset="1"/>
    </LinearGradientBrush>

    <GeometryGroup x:Key="FancyColorMarkerGeometry">
        <EllipseGeometry RadiusX="8" RadiusY="8"  />
        <EllipseGeometry RadiusX="4" RadiusY="4"  />
    </GeometryGroup>

    <Style x:Key="ColorThumbStyle" TargetType="{x:Type Thumb}">
        <Setter Property="Foreground" Value="{x:Null}"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Height" Value="5"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Thumb}">
                    <Grid Margin="0,0,0,-16" Height="12">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="12"/>
                            <ColumnDefinition Width="20"/>
                            <ColumnDefinition Width="12"/>
                        </Grid.ColumnDefinitions>
                        <Path Grid.Column="0" Stretch="Fill"  HorizontalAlignment="Center" VerticalAlignment="Center" x:Name="Path"  Fill="Black" Data="M0 4L 4 8 L 4 0 Z">
                            <Path.LayoutTransform>
                                <RotateTransform Angle="180"/>
                            </Path.LayoutTransform>
                        </Path>
                        <Path Grid.Column="2" Stretch="Fill"  HorizontalAlignment="Center" VerticalAlignment="Center" Fill="Black" Data="M0 4L 4 8 L 4 0 Z"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlLightLightBrushKey}}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="SliderRepeatButtonStyle" TargetType="{x:Type RepeatButton}">
        <Setter Property="OverridesDefaultStyle" Value="true"/>
        <Setter Property="IsTabStop" Value="false"/>
        <Setter Property="Focusable" Value="false"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RepeatButton}">
                    <Border Background="{TemplateBinding Background}"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="{x:Type local:ColorSlider}" TargetType="{x:Type local:ColorSlider}">
        <Setter Property="Orientation" Value="Vertical"/>
        <Setter Property="Stylus.IsPressAndHoldEnabled" Value="false"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="Minimum" Value="0"/>
        <Setter Property="Maximum" Value="100"/>
        <Setter Property="TickFrequency" Value="0.001" />
        <Setter Property="IsSnapToTickEnabled" Value="True" />
        <Setter Property="IsDirectionReversed" Value="False" />
        <Setter Property="Value" Value="1" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:ColorSlider}">
                    <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Height="{TemplateBinding Height}">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"
                  MinWidth="{TemplateBinding Slider.MinWidth}"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <Border x:Name="PART_TrackBackground" Grid.Column="1" Width="20" Margin="10,16,10,0">
                                <Rectangle x:Name="PART_SpectrumDisplay" Stretch="Fill" VerticalAlignment="Stretch" />
                            </Border>
                            <Canvas Grid.Column="1" HorizontalAlignment="Center" Width="4">
                                <Rectangle x:Name="PART_SelectionRange" Canvas.Left="1" Fill="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}" Width="2.0" Visibility="Hidden" />
                            </Canvas>
                            <Track Grid.Column="1" Name="PART_Track">
                                <Track.DecreaseRepeatButton>
                                    <RepeatButton Style="{StaticResource SliderRepeatButtonStyle}"
                                Command="Slider.DecreaseLarge"/>
                                </Track.DecreaseRepeatButton>
                                <Track.IncreaseRepeatButton>
                                    <RepeatButton Style="{StaticResource SliderRepeatButtonStyle}" Command="Slider.IncreaseLarge"/>
                                </Track.IncreaseRepeatButton>
                                <Track.Thumb>
                                    <Thumb x:Name="Thumb" Height="16" Style="{DynamicResource ColorThumbStyle}" />
                                </Track.Thumb>
                            </Track>
                        </Grid>
                    </Border>
                    <ControlTemplate.Triggers>
                        <!-- Display SelectionRange background -->
                        <Trigger Property="IsSelectionRangeEnabled" Value="True">
                            <Setter TargetName="PART_SelectionRange"
                 Property="Visibility" Value="Visible"/>
                        </Trigger>
                        <Trigger Property="Width" Value="Auto">
                            <Setter Property="MinWidth" Value="21"/>
                        </Trigger>
                        <Trigger Property="Height" Value="Auto">
                            <Setter Property="MinHeight" Value="104"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    
    <local:IntToGradientBrushConverter x:Key="brushconverter" TrueValue="SelectedLinearBrush" FalseValue="SelectedRadialBrush"/>

    <Style x:Key="{x:Type local:GradientControl}" TargetType="{x:Type local:GradientControl}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:GradientControl}">
                    <Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="4">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="160"/>
                            <ColumnDefinition Width="2*"/>
                            <ColumnDefinition Width="165"/>
                            <ColumnDefinition Width="2*"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="165"/>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>
                        <Border Grid.Row="0" Grid.Column="0" Background="{StaticResource CheckerBrush}" BorderBrush="{DynamicResource {x:Static SystemColors.ControlDarkDarkBrushKey}}" BorderThickness="2">
                            <Border Name="PART_ColorDetail" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Cursor="Cross" Width="160" Height="165">
                                <Border.Background>
                                    <DrawingBrush Opacity="1">
                                        <DrawingBrush.Drawing>
                                            <DrawingGroup>
                                                <GeometryDrawing>
                                                    <GeometryDrawing.Geometry>
                                                        <RectangleGeometry Rect="0,0,100,100" />
                                                    </GeometryDrawing.Geometry>
                                                    <GeometryDrawing.Brush>
                                                        <SolidColorBrush Color="{Binding ElementName=PART_ColorSlider, Path=SelectedColor}" />
                                                    </GeometryDrawing.Brush>
                                                </GeometryDrawing>
                                                <GeometryDrawing>
                                                    <GeometryDrawing.Geometry>
                                                        <RectangleGeometry Rect="0,0,100,100" />
                                                    </GeometryDrawing.Geometry>
                                                    <GeometryDrawing.Brush>
                                                        <LinearGradientBrush StartPoint="0.5,1" EndPoint="0.5,0">
                                                            <GradientStop Offset="0.0" Color="Black" />
                                                            <GradientStop Offset="1.0" Color="{Binding ElementName=PART_ColorSlider,Path=SelectedColor}" />
                                                        </LinearGradientBrush>
                                                    </GeometryDrawing.Brush>
                                                </GeometryDrawing>
                                                <DrawingGroup PresentationOptions:Freeze="True">
                                                    <GeometryDrawing>
                                                        <GeometryDrawing.Geometry>
                                                            <RectangleGeometry Rect="0,0,100,100" />
                                                        </GeometryDrawing.Geometry>
                                                        <GeometryDrawing.Brush>
                                                            <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                                                                <GradientStop Offset="0.0" Color="White" />
                                                                <GradientStop Offset="1" Color="Black" />
                                                            </LinearGradientBrush>
                                                        </GeometryDrawing.Brush>
                                                    </GeometryDrawing>
                                                    <DrawingGroup.OpacityMask>
                                                        <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
                                                            <GradientStop Offset="0.0" Color="#FF000000" />
                                                            <GradientStop Offset="1" Color="#00000000" />
                                                        </LinearGradientBrush>
                                                    </DrawingGroup.OpacityMask>
                                                </DrawingGroup>
                                            </DrawingGroup>
                                        </DrawingBrush.Drawing>
                                    </DrawingBrush>
                                </Border.Background>
                                <Path Name="PART_ColorMarker" StrokeThickness="2" Cursor="Cross" Fill="Transparent">
                                    <Path.Data>
                                        <EllipseGeometry RadiusX="7" RadiusY="7"  />
                                    </Path.Data>
                                    <Path.Stroke>
                                        <SolidColorBrush x:Name="markerBrush" Color="Black" />
                                    </Path.Stroke>
                                </Path>
                            </Border>
                        </Border>
                        <Grid Grid.Column="1" Grid.Row="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                            <local:ColorSlider x:Name="PART_ColorSlider" Grid.Column="1" Grid.Row="1" Value="0" Margin="5,-15,0,3" IsMoveToPointEnabled="True" IsSnapToTickEnabled="False" Maximum="360"/>
                        </Grid>
                        <Grid Grid.Column="2" Grid.Row="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Width="165" Height="165">
                            <Canvas x:Name="PART_GradientDetailsLinearGrid" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Width="165" Height="165">
                                <Canvas.Style>
                                    <Style TargetType="{x:Type Canvas}">
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=PART_GradientTypeCombo}" Value="0">
                                                <Setter Property="Visibility" Value="Visible"/>
                                            </DataTrigger>
                                            <DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=PART_GradientTypeCombo}" Value="1">
                                                <Setter Property="Visibility" Value="Collapsed"/>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </Canvas.Style>
                                <Border x:Name="PART_GradientDetailsLinearBorder" BorderBrush="Black" BorderThickness="2" Width="160" Height="160" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="5,5,0,0">
                                    <Border.Style>
                                        <Style TargetType="{x:Type Border}">
                                            <Style.Triggers>
                                                <DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=PART_GradientTypeCombo}" Value="0">
                                                    <Setter Property="Background" Value="{Binding Path=SelectedLinearBrush, RelativeSource={RelativeSource TemplatedParent}}"/>
                                                </DataTrigger>
                                                <DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=PART_GradientTypeCombo}" Value="1">
                                                    <Setter Property="Background" Value="{Binding Path=SelectedRadialBrush, RelativeSource={RelativeSource TemplatedParent}}"/>
                                                </DataTrigger>
                                            </Style.Triggers>
                                        </Style>
                                    </Border.Style>
                                </Border>
                                <Line x:Name="PART_GradientDetailsLinearLine" Stroke="Yellow" StrokeThickness="2" X1="{Binding X1, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" X2="{Binding X2, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Y1="{Binding Y1, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Y2="{Binding Y2, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"/>
                                <Thumb x:Name="PART_GradientDetailsLinearTopThumb" Width="10" Height="10" Style="{DynamicResource GradientLinearThumbStyle}" Canvas.Left="0" Canvas.Top="0"/>
                                <Thumb x:Name="PART_GradientDetailsLinearBottomThumb" Width="10" Height="10" Style="{DynamicResource GradientLinearThumbStyle}" Canvas.Right="0" Canvas.Bottom="0"/>
                            </Canvas>
                            <Canvas x:Name="PART_GradientDetailsRadialGrid" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Width="165" Height="165">
                                <Canvas.Style>
                                    <Style TargetType="{x:Type Canvas}">
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=PART_GradientTypeCombo}" Value="1">
                                                <Setter Property="Visibility" Value="Visible"/>
                                            </DataTrigger>
                                            <DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=PART_GradientTypeCombo}" Value="0">
                                                <Setter Property="Visibility" Value="Collapsed"/>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </Canvas.Style>
                                <Border x:Name="PART_GradientDetailsRadialBorder" BorderBrush="Gray" BorderThickness="2" Width="160" Height="160" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="5,5,0,0">
                                    <Border.Style>
                                        <Style TargetType="{x:Type Border}">
                                            <Setter Property="BorderThickness" Value="2"/>
                                            <Setter Property="BorderBrush" Value="Black"/>
                                            <Style.Triggers>
                                                <DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=PART_GradientTypeCombo}" Value="0">
                                                    <Setter Property="Background" Value="{Binding Path=SelectedLinearBrush, RelativeSource={RelativeSource TemplatedParent}}"/>
                                                </DataTrigger>
                                                <DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=PART_GradientTypeCombo}" Value="1">
                                                    <Setter Property="Background" Value="{Binding Path=SelectedRadialBrush, RelativeSource={RelativeSource TemplatedParent}}"/>
                                                </DataTrigger>
                                            </Style.Triggers>
                                        </Style>
                                    </Border.Style>
                                </Border>
                                <Ellipse x:Name="PART_GradientDetailsRadialEllipse" Fill="Transparent" Stroke="White" StrokeThickness="2" Canvas.Left="0" Canvas.Top="0"/>
                                <Thumb x:Name="PART_GradientDetailsRadialCenterThumb" Width="8" Height="8" Style="{DynamicResource GradientCenterThumbStyle}" Canvas.Left="0" Canvas.Top="0"/>
                                <Thumb x:Name="PART_GradientDetailsRadialTopThumb" Width="10" Height="10" Style="{DynamicResource GradientRadialThumbStyle}" Canvas.Left="0" Canvas.Top="0"/>
                                <Thumb x:Name="PART_GradientDetailsRadialBottomThumb" Width="10" Height="10" Style="{DynamicResource GradientRadialThumbStyle}" Canvas.Right="0" Canvas.Bottom="0"/>
                            </Canvas>
                        </Grid>
                        <Grid Grid.Column="3" Grid.Row="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="40"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Canvas x:Name="PART_GradientStopDeatils" Grid.Column="0" Width="40" VerticalAlignment="Center" Height="160" HorizontalAlignment="Center" Margin="15,3,0,0">
                                <Border x:Name="PART_GradientStopSlider" HorizontalAlignment="Center" Width="30" Height="160" MinWidth="30" VerticalAlignment="Stretch" BorderBrush="Black" BorderThickness="2" Canvas.Left="5" Canvas.Right="5" Canvas.Top="0" Canvas.Bottom="0"/>
                            </Canvas>
                            <Label x:Name="PART_GradientDetailsDesc" Grid.Column="1" HorizontalContentAlignment="Left" VerticalContentAlignment="Center" HorizontalAlignment="Center" VerticalAlignment="Top">
                                <Label.Content>
                                    <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
                                        <TextBlock x:Name="PART_Gradient_DetailsOffsetText" Text="00" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                                        <TextBlock x:Name="PART_Gradient_DetailsColorText" Text="00"   VerticalAlignment="Center" HorizontalAlignment="Center"/>
                                    </StackPanel>
                                </Label.Content>
                            </Label>
                        </Grid>
                        <Grid Grid.Column="0" Grid.Row="1" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="23"/>
                                <RowDefinition Height="21"/>
                                <RowDefinition Height="23"/>
                                <RowDefinition Height="22"/>
                                <RowDefinition Height="22"/>
                                <RowDefinition Height="22"/>
                                <RowDefinition Height="22"/>
                            </Grid.RowDefinitions>
                            <Label Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" FontFamily="{TemplateBinding FontFamily}" FontSize="{TemplateBinding FontSize}" Foreground="{TemplateBinding Foreground}">
                                <Bold>Hexadecimal Notation</Bold>
                            </Label>
                            <Border Grid.Column="0" Grid.Row="1" Grid.ColumnSpan="2" BorderBrush="Black" BorderThickness="2" Height="21">
                                <TextBox MaxLength="9" FontFamily="{TemplateBinding FontFamily}" FontSize="{TemplateBinding FontSize}" Foreground="{TemplateBinding Foreground}" Text="{Binding HexadecimalString, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" />
                            </Border>
                            <Label Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="2" FontFamily="{TemplateBinding FontFamily}" FontSize="{TemplateBinding FontSize}" Foreground="{TemplateBinding Foreground}">
                                <Bold>sRGB Color Codes</Bold>
                            </Label>
                            <Label Grid.Column="0" Grid.Row="3" FontFamily="{TemplateBinding FontFamily}" FontSize="11" Foreground="{TemplateBinding Foreground}" VerticalContentAlignment="Center" HorizontalAlignment="Right">A</Label>
                            <Border Grid.Column="1" Grid.Row="3" BorderBrush="Black" BorderThickness="2" Height="20">
                                <TextBox MaxLength="3" FontFamily="{TemplateBinding FontFamily}" FontSize="{TemplateBinding FontSize}" Foreground="{TemplateBinding Foreground}" Text="{Binding A, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" MinWidth="55"/>
                            </Border>
                            <Label Grid.Column="0" Grid.Row="4" FontFamily="{TemplateBinding FontFamily}" FontSize="11" Foreground="{TemplateBinding Foreground}" VerticalContentAlignment="Center" HorizontalAlignment="Right">R</Label>
                            <Border Grid.Column="1" Grid.Row="4" BorderBrush="Black" BorderThickness="2" Height="20">
                                <TextBox MaxLength="3" FontFamily="{TemplateBinding FontFamily}" FontSize="{TemplateBinding FontSize}" Foreground="{TemplateBinding Foreground}" Text="{Binding R, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" MinWidth="55"/>
                            </Border>
                            <Label Grid.Column="0" Grid.Row="5" FontFamily="{TemplateBinding FontFamily}" FontSize="11" Foreground="{TemplateBinding Foreground}" VerticalContentAlignment="Center" HorizontalAlignment="Right">G</Label>
                            <Border Grid.Column="1" Grid.Row="5" BorderBrush="Black" BorderThickness="2" Height="20">
                                <TextBox MaxLength="3" FontFamily="{TemplateBinding FontFamily}" FontSize="{TemplateBinding FontSize}" Foreground="{TemplateBinding Foreground}" Text="{Binding G, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" MinWidth="55"/>
                            </Border>
                            <Label Grid.Column="0" Grid.Row="6" FontFamily="{TemplateBinding FontFamily}" FontSize="11" Foreground="{TemplateBinding Foreground}" VerticalContentAlignment="Center" HorizontalAlignment="Right">B</Label>
                            <Border Grid.Column="1" Grid.Row="6" BorderBrush="Black" BorderThickness="2" Height="20">
                                <TextBox MaxLength="3" FontFamily="{TemplateBinding FontFamily}" FontSize="{TemplateBinding FontSize}" Foreground="{TemplateBinding Foreground}" Text="{Binding B, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" MinWidth="55"/>
                            </Border>
                        </Grid>
                        <Grid Grid.Column="2" Grid.Row="1" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="23"/>
                                <RowDefinition Height="23"/>
                                <RowDefinition Height="23"/>
                                <RowDefinition Height="23"/>
                                <RowDefinition Height="23"/>
                                <RowDefinition Height="23"/>
                            </Grid.RowDefinitions>
                            <TextBlock Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" VerticalAlignment="Center" HorizontalAlignment="Left">
                                <Bold>Gradient Type</Bold>
                            </TextBlock>
                            <ComboBox x:Name="PART_GradientTypeCombo" Grid.Column="0" Grid.Row="1" Grid.ColumnSpan="2" SelectedIndex="0">
                                <ComboBox.Items>
                                    <TextBlock Text="LinearGradientBrush" VerticalAlignment="Center"/>
                                    <TextBlock Text="RadialGradientBrush" VerticalAlignment="Center"/>
                                </ComboBox.Items>
                            </ComboBox>
                            <TextBlock Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="2" VerticalAlignment="Center" HorizontalAlignment="Left">
                                <Bold>Spread Method</Bold>
                            </TextBlock>
                            <ComboBox x:Name="PART_SpreadMethodCombo" Grid.Column="0" Grid.Row="3" Grid.ColumnSpan="2" SelectedIndex="0">
                                <ComboBox.Items>                                   
                                    <TextBlock Text="Pad" VerticalAlignment="Center"/>
                                    <TextBlock Text="Reflect" VerticalAlignment="Center"/>
                                    <TextBlock Text="Repeat" VerticalAlignment="Center"/>
                                </ComboBox.Items>
                            </ComboBox>
                            <TextBlock Grid.Column="0" Grid.Row="4" Grid.ColumnSpan="2" VerticalAlignment="Center" HorizontalAlignment="Left">
                                <Bold>Interpolation Mode</Bold>
                            </TextBlock>
                            <ComboBox x:Name="PART_InterpModeCombo" Grid.Column="0" Grid.Row="5" Grid.ColumnSpan="2" SelectedIndex="0">
                                <ComboBox.Items>
                                    <TextBlock Text="SRgb Linear" VerticalAlignment="Center"/>
                                    <TextBlock Text="ScRgb Linear" VerticalAlignment="Center"/>
                                </ComboBox.Items>
                            </ComboBox>
                        </Grid>
                        <Grid Grid.Column="3" Grid.Row="1" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="11,0,4,0">
                            <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                <Grid.Style>
                                    <Style TargetType="{x:Type Grid}">
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=PART_GradientTypeCombo}" Value="0">
                                                <Setter Property="Visibility" Value="Visible"/>
                                            </DataTrigger>
                                            <DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=PART_GradientTypeCombo}" Value="1">
                                                <Setter Property="Visibility" Value="Collapsed"/>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </Grid.Style>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="23"/>
                                    <RowDefinition Height="23"/>
                                    <RowDefinition Height="23"/>
                                </Grid.RowDefinitions>
                                <TextBlock Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" VerticalAlignment="Center">
                                    <Bold>Gradient Points</Bold>
                                </TextBlock>
                                <TextBlock Text="StartPoint" Grid.Column="0" Grid.Row="1" VerticalAlignment="Center" FontSize="11"/>
                                <Border Grid.Column="1" Grid.Row="1" BorderBrush="Black" BorderThickness="2" VerticalAlignment="Stretch">
                                    <TextBox x:Name="PART_GradientStartPointBox" Text="{Binding StartPoint, RelativeSource={RelativeSource TemplatedParent}}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
                                </Border>
                                <TextBlock Text="EndPoint" Grid.Column="0" Grid.Row="2" VerticalAlignment="Center" FontSize="11"/>
                                <Border Grid.Column="1" Grid.Row="2" BorderBrush="Black" BorderThickness="2" VerticalAlignment="Stretch">
                                    <TextBox x:Name="PART_GradientEndPointBox" Text="{Binding EndPoint, RelativeSource={RelativeSource TemplatedParent}}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
                                </Border>
                            </Grid>
                            <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                <Grid.Style>
                                    <Style TargetType="{x:Type Grid}">
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=PART_GradientTypeCombo}" Value="1">
                                                <Setter Property="Visibility" Value="Visible"/>
                                            </DataTrigger>
                                            <DataTrigger Binding="{Binding Path=SelectedIndex, ElementName=PART_GradientTypeCombo}" Value="0">
                                                <Setter Property="Visibility" Value="Collapsed"/>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </Grid.Style>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="23"/>
                                    <RowDefinition Height="23"/>
                                    <RowDefinition Height="23"/>
                                    <RowDefinition Height="23"/>
                                    <RowDefinition Height="23"/>
                                </Grid.RowDefinitions>
                                <TextBlock Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" VerticalAlignment="Center">
                                    <Bold>Radial Points</Bold>
                                </TextBlock>
                                <TextBlock Text="Center :" Grid.Column="0" Grid.Row="1" VerticalAlignment="Center" FontSize="11"/>
                                <Border Grid.Column="1" Grid.Row="1" BorderBrush="Black" BorderThickness="2" VerticalAlignment="Stretch">
                                    <TextBox x:Name="PART_GradientRadialCenterPointBox" Text="{Binding Center, RelativeSource={RelativeSource TemplatedParent}}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
                                </Border>
                                <TextBlock Text="Origin :" Grid.Column="0" Grid.Row="2" VerticalAlignment="Center" FontSize="11"/>
                                <Border Grid.Column="1" Grid.Row="2" BorderBrush="Black" BorderThickness="2" VerticalAlignment="Stretch">
                                    <TextBox x:Name="PART_GradientRadialOriginPointBox" Text="{Binding GradientOrigin, RelativeSource={RelativeSource TemplatedParent}}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
                                </Border>
                                <TextBlock Text="RadiusX :" Grid.Column="0" Grid.Row="3" VerticalAlignment="Center" FontSize="11"/>
                                <Border Grid.Column="1" Grid.Row="3" BorderBrush="Black" BorderThickness="2" VerticalAlignment="Stretch">
                                    <TextBox x:Name="PART_GradientRadialRadiusXBox" Text="{Binding RadiusX, RelativeSource={RelativeSource TemplatedParent}}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
                                </Border>
                                <TextBlock Text="RadiusY :" Grid.Column="0" Grid.Row="4" VerticalAlignment="Center" FontSize="11"/>
                                <Border Grid.Column="1" Grid.Row="4" BorderBrush="Black" BorderThickness="2" VerticalAlignment="Stretch">
                                    <TextBox x:Name="PART_GradientRadialRadiusYBox" Text="{Binding RadiusY, RelativeSource={RelativeSource TemplatedParent}}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
                                </Border>
                            </Grid>
                        </Grid>
                        <Grid Grid.Column="1" Grid.Row="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="5,15,0,0">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="23"/>
                                <RowDefinition Height="24"/>
                                <RowDefinition Height="30"/>
                                <RowDefinition Height="30"/>
                                <RowDefinition Height="30"/>
                            </Grid.RowDefinitions>
                            <TextBlock VerticalAlignment="Center" HorizontalAlignment="Center" Grid.Row="0">
                                <Bold>Color Stop</Bold>
                            </TextBlock>
                            <Border Grid.Row="1" BorderBrush="Black" BorderThickness="2" VerticalAlignment="Center" Width="63" Height="23" HorizontalAlignment="Center">
                                <TextBox x:Name="PART_GradientDetailsStopAddBox" VerticalAlignment="Center" HorizontalAlignment="Center" Width="63" Height="23"/>
                            </Border>
                            <Button x:Name="PART_AddGradientstopButton" Grid.Row="2" Width="82" Height="27" VerticalAlignment="Center" HorizontalAlignment="Center">
                                <Button.Content>
                                    <StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center">
                                        <TextBlock Text="Add Stop" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                                    </StackPanel>
                                </Button.Content>
                            </Button>
                            <Border Grid.Row="3" BorderBrush="Black" BorderThickness="2" VerticalAlignment="Bottom" Width="63" Height="23" HorizontalAlignment="Center">
                                <TextBox x:Name="PART_GradientDetailsStopRemoveBox" VerticalAlignment="Center" HorizontalAlignment="Center" Width="63" Height="23"/>
                            </Border>
                            <Button x:Name="PART_RemoveGradientstopButton" Grid.Row="4" Width="82" Height="27" VerticalAlignment="Center" HorizontalAlignment="Center">
                                <Button.Content>
                                    <StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center">
                                        <TextBlock Text="Remove Stop" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                                    </StackPanel>
                                </Button.Content>
                            </Button>
                        </Grid>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <LinearGradientBrush x:Key="GradientStopThumbFocusBrush" StartPoint="1,0" EndPoint="1,1">
        <GradientStop Color="Blue" Offset="0"/>
        <GradientStop Color="White" Offset="1"/>
    </LinearGradientBrush>
    
    <Style x:Key="GradientStopThumbStyle" TargetType="{x:Type Thumb}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Thumb}">
                    <Grid x:Name="PART_ThumbGrid">
                        <Ellipse x:Name="GradientStopThumbEllipse" Fill="{Binding Path=Background, RelativeSource={RelativeSource TemplatedParent}}" Stroke="Yellow" StrokeThickness="2" Width="12" Height="9" Focusable="True">
                            <Ellipse.FocusVisualStyle>
                                <Style TargetType="{x:Type Ellipse}">
                                    <Setter Property="Stroke" Value="{DynamicResource GradientStopThumbFocusBrush}"/>
                                </Style>
                            </Ellipse.FocusVisualStyle>
                        </Ellipse>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsKeyboardFocused" Value="True">
                            <Setter Property="Stroke" TargetName="GradientStopThumbEllipse" Value="LightBlue"/>
                        </Trigger>
                        <Trigger Property="IsKeyboardFocused" Value="False">
                            <Setter Property="Stroke" TargetName="GradientStopThumbEllipse" Value="Yellow"/>
                        </Trigger>
                        <Trigger Property="Button.IsPressed" Value="True">
                            <Setter Property="Fill" TargetName="GradientStopThumbEllipse" Value="LightBlue"/>
                        </Trigger>
                    </ControlTemplate.Triggers>                    
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="{x:Type local:GradientStopSlider}" TargetType="{x:Type local:GradientStopSlider}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:GradientStopSlider}">
                    <Grid x:Name="PART_GradientStopGrid" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Background="Transparent" Margin="9,15,15,8">
                        <Border x:Name="PART_GradientStopMarker" BorderBrush="Black" BorderThickness="2" Background="{Binding SelectedBrush, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Margin="4,0,6,0">
                            <Canvas HorizontalAlignment="Stretch" VerticalAlignment="Stretch"  Margin="15,-2,6,-2" Background="Transparent">
                                <Thumb x:Name="PART_GradientStartPointThumb" Style="{DynamicResource GradientStopThumbStyle}"/>
                                <Thumb x:Name="PART_GradientEndPointThumb" Style="{DynamicResource GradientStopThumbStyle}"/>
                            </Canvas>
                        </Border>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    
    <Style x:Key="GradientLinearThumbStyle" TargetType="{x:Type Thumb}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Thumb}">
                    <Border BorderBrush="Black" BorderThickness="1" Background="Yellow"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="GradientCenterThumbStyle" TargetType="{x:Type Thumb}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Thumb}">
                    <Ellipse Width="{Binding Path=Width, RelativeSource={RelativeSource TemplatedParent}}" Height="{Binding Path=Height, RelativeSource={RelativeSource TemplatedParent}}" Fill="Yellow" Stroke="Orange" StrokeThickness="1"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="GradientRadialThumbStyle" TargetType="{x:Type Thumb}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Thumb}">
                    <Border BorderBrush="Black" BorderThickness="1" Background="Yellow">
                        <Border.Style>
                            <Style TargetType="{x:Type Border}">
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding Path=Name, RelativeSource={RelativeSource TemplatedParent}}" Value="PART_GradientDetailsRadialTopThumb">
                                        <Setter Property="Cursor" Value="SizeNS"/>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding Path=Name, RelativeSource={RelativeSource TemplatedParent}}" Value="PART_GradientDetailsRadialBottomThumb">
                                        <Setter Property="Cursor" Value="SizeWE"/>
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Border.Style>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    
</ResourceDictionary>